<template>
    <a-card :bordered="false">
        <a-row>
            <a-col :span="12">
                前三载分数高于 70 分及格
                <p v-for="(record, index) in dataSource" :key="record.id">
                    前{{ index + 1 }}载比对评分:
                    <span :style="{ color: record.text2 >= 70 ? '#52c41a' : '#ff4d4f' }">
                        {{ record.text2 }}
                    </span> 分
                </p>
            </a-col>
            <a-col :span="12" v-if="dataSource.length">
                <p>
                    前一载送货地点比对最短距离:
                    <span :style="{ color: dataSource[0].text3 <= 1000 ? '#52c41a' : '#ff4d4f' }">
                        {{ dataSource[0].text3 }}
                    </span> 米
                </p>
                <p>
                    前一载提货地点比对最短距离:
                    <span :style="{ color: dataSource[0].text4 <= 1000 ? '#52c41a' : '#ff4d4f' }">
                        {{ dataSource[0].text4 }}
                    </span> 米
                </p>
            </a-col>
        </a-row>
        <div>
            <a-table ref="table" size="middle" bordered rowKey="id" :columns="columns" :dataSource="dataSource">
            </a-table>
        </div>
        <!-- <p v-for="record in dataSource" :key="record.text1">{{ record.text1 }}</p> -->
    </a-card>
</template>

<script>

import '@/assets/less/TableExpand.less'

export default {
    name: 'IdentifyRecordList',
    components: {
    },
    props: {
        dataSource: {
            type: Array,
            required: true
        },
    },
    data() {
        return {
            description: 'ocr识别记录管理页面',
            // 表头
            columns: [
                {
                    title: '序号',
                    align: "center",
                    dataIndex: 'serialNumber'
                },
                {
                    title: '装运时间',
                    align: "center",
                    dataIndex: 'shipmentTime'
                },
                {
                    title: '装载品种、等级',
                    align: "center",
                    dataIndex: 'productType'
                },
                {
                    title: '是否转基因',
                    align: "center",
                    dataIndex: 'geneticallyModified'
                },
                {
                    title: '提货地点',
                    align: "center",
                    dataIndex: 'pickupLocation'
                },
                {
                    title: '送货地点',
                    align: "center",
                    dataIndex: 'deliveryLocation'
                },
                {
                    title: '卸车时间',
                    align: "center",
                    dataIndex: 'unloadingTime'
                },
            ],
            url: {
                list: "/identifyRecord/identifyRecord/list",
                delete: "/identifyRecord/identifyRecord/delete",
                deleteBatch: "/identifyRecord/identifyRecord/deleteBatch",
                exportXlsUrl: "/identifyRecord/identifyRecord/exportXls",
                importExcelUrl: "identifyRecord/identifyRecord/importExcel",

            },
            dictOptions: {},
            superFieldList: [],
        }
    },
    created() {
    },
    computed: {
    },
    mounted() {
    },
    methods: {

    }
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>